<template>
  <view>
    <theme-box>
      <wd-tabbar v-model="tabbar" shape="round" fixed bordered safeAreaInsetBottom placeholder @change="tabbarChange">
        <wd-tabbar-item title="首页" icon="home">
        </wd-tabbar-item>
        <wd-tabbar-item title="分类" icon="cart"></wd-tabbar-item>
        <wd-tabbar-item title="我的" icon="user"></wd-tabbar-item>
      </wd-tabbar>
      <home v-if="tabbar === 0"></home>
    </theme-box>
  </view>
</template>

  
<script>
	import { ref } from 'vue'
  import home from '../home/index.vue'
	export default {
    components: {
      home
    }, 
		setup() {
			const tabbar = ref(0)
      function tabbarChange ({value}) {
        console.log(value)
      }
      return{
        tabbar,
        tabbarChange
      }
		},
	}
</script>